 // 倒计时
 $(function () {
     let timer = setInterval(function () {
         let nowTime = new Date();
         if (nowTime.getHours() < 10) {
             $(".sale-list").eq(0).find(".sale-timer-clock").html("20:00");
             $(".sale-list").eq(1).find(".sale-timer-clock").html("00:00");
             $(".sale-list").eq(1).find(".countdown-num").eq(0).html((10 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".sale-timer-clock").html("10:00");
             $(".sale-list").eq(2).find(".date-num").eq(0).html((10 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".about-to-start").eq(0).html("即将开始");
             $(".sale-list").eq(3).find(".sale-timer-clock").html("14:00");
             $(".sale-list").eq(3).find(".date-num").eq(0).html((10 - nowTime.getHours() - 1 + 4).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".about-to-start").eq(0).html("即将开始");
         } else if (nowTime.getHours() < 14) {
             $(".sale-list").eq(0).find(".sale-timer-clock").html("00:00");
             $(".sale-list").eq(1).find(".sale-timer-clock").html("10:00");
             $(".sale-list").eq(1).find(".countdown-num").eq(0).html((14 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".sale-timer-clock").html("14:00");
             $(".sale-list").eq(2).find(".date-num").eq(0).html((14 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".about-to-start").eq(0).html("即将开始");
             $(".sale-list").eq(3).find(".sale-timer-clock").html("20:00");
             $(".sale-list").eq(3).find(".date-num").eq(0).html((14 - nowTime.getHours() - 1 + 6)).toString().padStart(2, "0");
             $(".sale-list").eq(3).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".about-to-start").eq(0).html("即将开始");
         } else if (nowTime.getHours() < 20) {
             $(".sale-list").eq(0).find(".sale-timer-clock").html("10:00");
             $(".sale-list").eq(1).find(".sale-timer-clock").html("14:00");
             $(".sale-list").eq(1).find(".countdown-num").eq(0).html((20 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".sale-timer-clock").html("20:00");
             $(".sale-list").eq(2).find(".date-num").eq(0).html((20 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".about-to-start").eq(0).html("即将开始");
             $(".sale-list").eq(3).find(".sale-timer-clock").html("00:00");
             $(".sale-list").eq(3).find(".date-num").eq(0).html((24 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".about-to-start").eq(0).html("明日开始");
         } else {
             $(".sale-list").eq(0).find(".sale-timer-clock").html("14:00");
             $(".sale-list").eq(1).find(".sale-timer-clock").html("20:00");
             $(".sale-list").eq(1).find(".countdown-num").eq(0).html((24 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(1).find(".countdown-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".sale-timer-clock").html("00:00");
             $(".sale-list").eq(2).find(".date-num").eq(0).html((24 - nowTime.getHours() - 1).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(2).find(".about-to-start").eq(0).html("明日开始");
             $(".sale-list").eq(3).find(".sale-timer-clock").html("10:00");
             $(".sale-list").eq(3).find(".date-num").eq(0).html((24 - nowTime.getHours() - 1 + 10).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(1).html((59 - nowTime.getMinutes()).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".date-num").eq(2).html((60 - Math.ceil((nowTime % 60000) / 1000)).toString().padStart(2, "0"));
             $(".sale-list").eq(3).find(".about-to-start").eq(0).html("明日开始");
         }
     }, 1000)
 })

 // 
 // $('.sale-timer').click(function () { 
 //     // $(this).css('color','red')
 //     $('span').addClass('active')

 //  })
//  $('.sale-timer').on('click', function () {
//      $('.sale-timer span').addClass('active')
//  })

let totalBtn = document.querySelector('.total')
let prevBtn = document.querySelector('.prev')
let nextBtn = document.querySelector('.next')
let selectBtn = document.querySelector('select')

 $('.sale-timer-text span').on('click',function(){
    
    $('.sale-timer-text span').removeClass('active')
    $(this).toggleClass('active')
    
    
    //  $(this)
 })

 $('.sale11').on('click',function(){
    console.log(1);
    let list = goods2.data.detail
   
    // 截取数组成新的数组
    let bindList = list.slice((current - 1) * pageSize, current * pageSize)

console.log(goods3.data.detail);
    shop1(goods3.data.detail)
    function shop1(arr){
    console.log(arr);
      // 定义一个空字符串
      let num = rounderNum(0,99)
      let contentBox = document.querySelector('.goods_wrap')
      let str = ''
      arr.forEach(item => {
      str +=`
      <ul class="show" data-id="11">
      <li class="img-size"><img src="${item.url}" alt=""></li>
      <li class="title"><span class="fnt">${item.title}</span></li>
      <li class="card-line"><div class="line"></div><span class="med">已抢${num}%</span></li>
      <li class="card-option"><span class="red-text">￥${item.price}</span><del>￥${item.originalPrice}</del><button>${item.buttonStatusDesc}</button></li>
      </ul>
      `
      })
      contentBox.innerHTML = str
    }
     
    totalBtn.innerText = current + '/' + total
            // 判断左按钮什么时候有disabled类名
            // if (current === 1) {
            //     // 个时候添加disabled类名
            //     // 讲一个新的知识点 
            //     // class是一个原生属性  但是也是一个关键字 
            //     // 为了避免 我们把class使用的时候用做className
            //     prevBtn.className = 'prev disable'
            // } else {
            //     prevBtn.className = 'prev'
            // }
            prevBtn.className = current === 1 ? 'prev disable' : 'prev'

            // 判断右按钮什么时候有disabled类名
            nextBtn.className = current === total ? 'next disable' : 'next'

 })

 $('.sale22').on('click',function(){
    console.log(1);
    let list = goods.data.detail
   
    // 截取数组成新的数组
    let bindList = list.slice((current - 1) * pageSize, current * pageSize)

console.log(goods.data.detail);
    shop1(goods.data.detail)
    function shop1(arr){
    console.log(arr);
      // 定义一个空字符串
      let num = rounderNum(0,99)
      let contentBox = document.querySelector('.goods_wrap')
      let str = ''
      arr.forEach(item => {
      str +=`
      <ul class="show" data-id="11">
      <li class="img-size"><img src="${item.url}" alt=""></li>
      <li class="title"><span class="fnt">${item.title}</span></li>
      <li class="card-line"><div class="line"></div><span class="med">已抢${num}%</span></li>
      <li class="card-option"><span class="red-text">￥${item.price}</span><del>￥${item.originalPrice}</del><button>${item.buttonStatusDesc}</button></li>
      </ul>
      `
      })
      contentBox.innerHTML = str
    }
     
    totalBtn.innerText = current + '/' + total
            // 判断左按钮什么时候有disabled类名
            // if (current === 1) {
            //     // 个时候添加disabled类名
            //     // 讲一个新的知识点 
            //     // class是一个原生属性  但是也是一个关键字 
            //     // 为了避免 我们把class使用的时候用做className
            //     prevBtn.className = 'prev disable'
            // } else {
            //     prevBtn.className = 'prev'
            // }
            prevBtn.className = current === 1 ? 'prev disable' : 'prev'

            // 判断右按钮什么时候有disabled类名
            nextBtn.className = current === total ? 'next disable' : 'next'

 })
 $('.sale33').on('click',function(){
    console.log(1);
    let list = goods1.data.detail
   
    // 截取数组成新的数组
    let bindList = list.slice((current - 1) * pageSize, current * pageSize)

console.log(goods1.data.detail);
    shop1(goods1.data.detail)
    function shop1(arr){
    console.log(arr);
      // 定义一个空字符串
      let num = rounderNum(0,99)
      let contentBox = document.querySelector('.goods_wrap')
      let str = ''
      arr.forEach(item => {
      str +=`
      <ul class="show" data-id1="11">
      <li class="img-size"><img src="${item.url}" alt=""></li>
      <li class="title"><span class="fnt">${item.title}</span></li>
      <li class="card-line"><div class="line"></div><span class="med">已抢${num}%</span></li>
      <li class="card-option"><span class="red-text">￥${item.price}</span><del>￥${item.originalPrice}</del><button>${item.buttonStatusDesc}</button></li>
      </ul>
      `
      })
      contentBox.innerHTML = str
    }
     
    totalBtn.innerText = current + '/' + total
            // 判断左按钮什么时候有disabled类名
            // if (current === 1) {
            //     // 个时候添加disabled类名
            //     // 讲一个新的知识点 
            //     // class是一个原生属性  但是也是一个关键字 
            //     // 为了避免 我们把class使用的时候用做className
            //     prevBtn.className = 'prev disable'
            // } else {
            //     prevBtn.className = 'prev'
            // }
            prevBtn.className = current === 1 ? 'prev disable' : 'prev'

            // 判断右按钮什么时候有disabled类名
            nextBtn.className = current === total ? 'next disable' : 'next'

 })
//  刷新页面
$('.reload').on('click',function () { 
    window.location.reload(true)
 })
//  fun()
//  async function fun(){
//     let res = await $.ajax({
//         url:'/op',
//         data:{
//             currentPage: 1,
//             pageSize: 20
//         },
//         dataType:'json'
//     })

//     console.log(res);
//  }
//  $.ajax({
//         url: '/op',
//         dataType: 'json',
//         data:{
//             currentPage: 1,
//             pageSize: 20
//         },
//         success: function (res) {
//             console.log(res);
//         }
//     })
// getList()
// async function getList(){
//     let res = await pAjax({
//         url: '/op',
//         dataType: 'json',
//         data:{
//             pageNum: 1,
//     pageSize: 12,
//     t: new Date().getTime()
//         },
//     })
//     console.log(res);
// }
// let num = rounderNum(0,99)
// let contentBox = document.querySelector('.goods_wrap')
// let str = ''
// goods2.data.detail.forEach(item => {
// str +=`
// <ul class="show">
// <li class="img-size"><img src="${item.url}" alt=""></li>
// <li class="title"><span class="fnt">${item.title}</span></li>
// <li class="card-line"><div class="line"></div><span class="med">已抢${num}%</span></li>
// <li class="card-option"><span class="red-text">￥${item.price}</span><del>￥${item.originalPrice}</del><button>${item.buttonStatusDesc}</button></li>
// </ul>
// `
// })
// contentBox.innerHTML = str

// 分页


var current = 1  // 多少页
        var pageSize = 4   //一页多少条
        // 定义总页数在外面
        var total = 1

        // 页面一打开就是执行(调用)
        bindHtml()
        // 设计我们的函数  重复要做的事情
        function bindHtml() {
            var list = goods2.data.detail
            console.log(list);
            // 截取数组成新的数组
            var bindList = list.slice((current - 1) * pageSize, current * pageSize)
            // console.log(bindList);
            // 计算总页数
            console.log(bindList);
            total = Math.ceil(list.length / pageSize)
            // 渲染页面
            // 定义一个空字符串
            let num = rounderNum(0,99)
            let contentBox = document.querySelector('.goods_wrap')
            let str = ''
            bindList.forEach(item => {
            str +=`
            <ul class="show" data-id1="${item.id}">
            <li class="img-size"><img src="${item.url}" alt=""></li>
            <li class="title"><span class="fnt">${item.title}</span></li>
            <li class="card-line"><div class="line"></div><span class="med">已抢${num}%</span></li>
            <li class="card-option"><span class="red-text">￥${item.price}</span><del>￥${item.originalPrice}</del><button>${item.buttonStatusDesc}</button></li>
            </ul>
            `
            })
            contentBox.innerHTML = str
            // 渲染总的页数
            totalBtn.innerText = current + '/' + total
            // 判断左按钮什么时候有disabled类名
            // if (current === 1) {
            //     // 个时候添加disabled类名
            //     // 讲一个新的知识点 
            //     // class是一个原生属性  但是也是一个关键字 
            //     // 为了避免 我们把class使用的时候用做className
            //     prevBtn.className = 'prev disable'
            // } else {
            //     prevBtn.className = 'prev'
            // }
            prevBtn.className = current === 1 ? 'prev disable' : 'prev'

            // 判断右按钮什么时候有disabled类名
            nextBtn.className = current === total ? 'next disable' : 'next'
        }

        // 给右按钮添加点击事件
        nextBtn.onclick = function () {
            // 判断百分之百不需要切换的情况
            if (current === total) return
            // 代码能执行到这里说明不是最后一页
            current++
            // 再次调用函数
             
            bindHtml()
        }

        // 给左按钮添加点击事件
        prevBtn.onclick = function () {
            // 判断百分之百不需要切换的情况
            if (current === 1) return
            // 代码能执行到这里说明不是第一页
            current--
            // 再次调用函数
            bindHtml()

        }
        // 给select添加事件 change 事件
        selectBtn.onchange = function () {
            // 修改我们之前的一页显示多少条
            pageSize = selectBtn.value - 0
            // console.log(typeof pageSize);
            current = 1

            // 调用函数
            bindHtml()
        }


        // 商品点击
        // $('.show').on('click',function () { 


            
        //     list.forEach(function (item) { 

        //      })
        //  })

        let goods_wrap = document.querySelector('.goods_wrap')
        let show = document.querySelector('.show')
        console.log(show.dataset.id1);
        goods_wrap.addEventListener('click',function(e){
            e = e || window.event
            console.log(e.target);
            // console.log(e.target.dataSet.id1);
            if(e.target.className == 'show'){
                console.log(11);
                window.sessionStorage.setItem('id',e.target.dataset.id1)
                window.location.href = '../views/detail.html'
            }

        })
           

            
        
